<!DOCTYPE html>
<html xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <meta name="description" content="A fully featured admin theme which can be used to build CRM, CMS, etc.">
    <meta name="author" content="Coderthemes">
	
	<!-- jQuery  -->
    <script type="text/javascript" src="/static/plugins/jquery/jquery-3.6.0.min.js"></script>
	
	<!-- layui  -->
	<link rel="stylesheet" href="/static/plugins/layui/2.7.6/css/layui.css" media="all" />
	<script src="/static/plugins/layui/2.7.6/layui.js" charset="utf-8"></script>
	
	<link rel="stylesheet" href="/static/admin/css/mini-ease-edit.css">


</head>
<body>

	<form class="layui-form" id="formId" method="post" action="/api/inter/tpShopRegisterPhaseRecord/updateWorkContent">
		<!--第一行-->
		<div class="layui-form-item">


			<div class="layui-inline layui-col-xs12 margin_r0">
				<div style="width: 90%; margin: 0 auto;margin-top: 50px;">

					<div th:if="${dto.hasFinish} == 0">
						<textarea name="workContent" id="workContent" placeholder=""  class="layui-textarea" maxlength="500" ></textarea>
						<div><span id="textCount">0</span>/500</div>
					</div>
					<div th:if="${dto.hasFinish} == 1">
						<textarea placeholder="" class="layui-textarea" id="workContentNo"  readOnly="true"></textarea>
						<div><span id="textCount">0</span>/500</div>
					</div>
				</div>
			</div>

		</div>


		<!--隐藏域-->
		<input type="hidden" name="id" id="id" th:value="${dto.id}">

		<input type="hidden" name="workContentHid" id="workContentHid" th:value="${dto.workContent}">

		<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;"></fieldset>

		<div class="layui-form-item" th:if="${dto.hasFinish} eq '0'">
			<div class="layui-col-md1 layui-col-md-offset11">
				<div class="layui-btn-container" style="float: right;margin-right: 50px;">
					<button type="button" class="layui-btn" lay-submit lay-filter="formSubmit">保存</button>
				</div>
			</div>
		</div>
	</form>
	<script>
	$(function () {



		var workContent = $('#workContentHid').val();
		$('#workContent').text(workContent);
		//$('#textCount').text(workContent.length);
		$('#workContentNo').text(workContent);
		//$('#textCountNo').text(workContent.length);

		document.getElementById('textCount').innerHTML = workContent.length;

		//var el = document.getElementById('workContent');
		//el.addEventListener('input',function () {
			//var len =  txtCount(this); //   调用函数
			//document.getElementById('textCount').innerHTML = len;
		//});

		layui.use(['form', 'code'], function(){
			var form = layui.form;
			console.log('form',form);


			// 表单提交，共用同一个
			form.on('submit(formSubmit)', function(data){
				console.log('data',data);

				if(data.field.workContent ==undefined || data.field.workContent ==null || data.field.workContent =='' ){
					layer.msg('请填写工作内容', {icon: 0});
					return ;
				}
				var indexOfLoading = layer.load(1, {
					shade: [0.5,'#000000'] //0.1透明度的白色背景
				});
				$.post(data.form.action, data.field, function(res){
					if (res.code == 0) {
						layer.msg(res.msg);
						setTimeout(function(){
							window.parent.location.reload();
						}, 1000);
					} else {
						layer.close(indexOfLoading);
						layer.msg(res.msg);
					}
				});
				return false;
			});
			layui.code();
		});


	});


	var el = document.getElementById('workContent');
	el.addEventListener('input',function () {
		var len =  txtCount(this); //   调用函数
		document.getElementById('textCount').innerHTML = len;
	});

	//函数 - 获取文本内容和长度
	function txtCount(el) {
		var val = el.value;
		var eLen = val.length;
		return eLen;
	}

	</script>

</body>
</html>
